<!DOCTYPE html>
<html lang="ja">

<head>
<meta charset='UTF-8'>
<title>まねぽん - プロデューサー</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<link type="text/css" rel="stylesheet" href="./css/main.css"/>

<style>
<！--
table	{
	border-collapse: collapse;
	table-layout: fixed;
}

th {
	/*border: solid 1px #aaaaaa;*/
	background-color: lightcyan;
	color: darkblue;
	width: auto;
	padding: 6px 6px;
	font-size: 1.0em;
	text-align: center;
}

td {
	/*border: solid 1px #aaaaaa;*/
	padding: 3px 6px;
	font-size: 1.0em;
	text-align: center;
}

td.name_column {
	text-align: left;
}
td.name_column:hover {
	color:red;
	font-weight:bold;
	text-align: left;
}

.active_star{
color:gold;
}

.inactive_star{
color:lightgray;
}

.odd {
	border-bottom: 1px #aaaaaa solid;
}

.even {
	background-color: whitesmoke;
}

.rank_1st{
	font-size: 1.5em;
}
.rank_2nd{
	font-size: 1.3em;
}
.rank_3rd{
	font-size: 1.2em;
}
-->
</style>


</head>

<body>
<div id="container">
	<div id="header">
	</div>

	<div id="menu">
    <ul>
        <li><a href="seed.html">トップ</a></li>
    </ul>
	</div>

	<div id="content">
		<div style="margin-left:24px"><h1>プロデューサー・ランキング</h1></div>
		<div style="margin:32px;">
			<table frame=void>
			<tr>
				<th style="width:50px;">順位</th>
				<th  colspan=2 style="width:180px;text-align:left;">プロデューサー</th>
				<th style="width:160px;">ランク</th>
			</tr>
			<tr class="odd">
				<td class="rank_1st">1</td>
				<td><img src="images/default-avatar.gif" alt="" width="24" height="24" /> </td>
				<td class="rank_1st name_column">しろやまさん</td>
				<td >
					<span class=active_star>★★★★★</span>
					<span class=inactive_star></span>
				</td>
			</tr>	
			<tr class="even">
				<td class="rank_2nd">2</td>
				<td><img src="images/default-avatar.gif" alt="" width="24" height="24" /> </td>
				<td class="rank_2nd name_column">ジョブスさん</td>
				<td >
					<span class=active_star>★★★★</span>
					<span class=inactive_star>☆</span>
				</td>
			</tr>	
			<tr class="odd">
				<td class="rank_3rd">3</td>
				<td><img src="images/default-avatar.gif" alt="" width="24" height="24" /> </td>
				<td class="rank_3rd name_column">ゲイツさん</td>
				<td >
					<span class=active_star>★★★</span>
					<span class=inactive_star>☆☆</span>
				</td>
			</tr>	
			<tr class="even">
				<td>4</td>
				<td><img src="images/default-avatar.gif" alt="" width="24" height="24" /> </td>
				<td class="name_column">エリソンさん</td>
				<td>
					<span class=active_star>★★</span>
					<span class=inactive_star>☆☆☆</span>
				</td>
			</tr>	
			<tr class="odd">
				<td>5</td>
				<td><img src="images/default-avatar.gif" alt="" width="24" height="24" /> </td>
				<td class="name_column">マクネリさん</td>
				<td>
					<span class=active_star>★</span>
					<span class=inactive_star>☆☆☆☆</span>
				</td>
			</tr>	
			<tr class="even">
				<td>6</td>
				<td><img src="images/default-avatar.gif" alt="" width="24" height="24" /> </td>
				<td class="name_column">寛平ちゃん</td>
				<td>
					<span class=active_star>★</span>
					<span class=inactive_star>☆☆☆☆</span>
				</td>
			</tr>	
			</table>
		</div>
	</div>
	
	<div id="footer">
	</div>
	
</div>
</body>

</html>
